import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

import vuexPersist from "vuex-persist";
export default new Vuex.Store({
  state: {
    list: [
      { title: "任务1" },
      { title: "任务2" },
      { title: "任务3" },
      { title: "任务4" },
    ],
    result: [],
    //复选框组
    checked: false,
    //全选按钮
  },
  mutations: {
    add(state, title) {
      state.list.push({ title: title });
    },
    remove(state, obj) {
      state.list.splice(obj.index, 1);
      state.result.forEach((item, index) => {
        if (item == obj.item) {
          state.result.splice(index, 1);
        }
      });
      //删除除了从list中删除 也要从result中删除
    },
    change(state) {
      if (state.result.length == state.list.length) {
        state.checked = true;
      } else {
        state.checked = false;
      }
    },
    checkall(state) {
      if (state.checked == true) {
        state.result = state.list;
      } else {
        state.result = [];
      }
    },
    clear(state) {
      state.list = state.list.filter((item) => {
        return state.result.includes(item) == false;
      });
      state.result = [];
    },
  },
  actions: {},
  modules: {},
  plugins: [
    new vuexPersist({
      storage: window.localStorage,
    }).plugin,
  ],
});
